Telegram Group & Telegram Channel
👩‍💻 Псевдокласс :focus

Сайтом можно пользоваться не только с использованием мышки, но и при помощи клавиатуры. При переключении клавишей Tab элементу добавляется псевдокласс :focus, и мы можем задать для него красивые стили.

⚠️ Важно! В браузерах Safari и Firefox на Mac при клике мышкой на кнопку фокус не устанавливается.

➡️ После любого селектора ставим двоеточие и пишем ключевое слово focus.

a:focus {
outline: 2px solid hotpink;
}


➡️ Фишки:

Смену стилей между состояниями можно анимировать при помощи transition

В браузер встроены дефолтные стили для фокуса.

Нельзя полностью удалять стили для фокуса, заменяйте их на свои, если дефолтные не нравятся.

Стили для фокуса можно увидеть, открыв сайт и несколько раз нажав клавишу Tab. Или нажмите на кнопку, поставьте курсор в поле ввода.

CodeBase | Frontend | #css
Please open Telegram to view this post
VIEW IN TELEGRAM



tg-me.com/codebase_frontend/719
Create:
Last Update:

👩‍💻 Псевдокласс :focus

Сайтом можно пользоваться не только с использованием мышки, но и при помощи клавиатуры. При переключении клавишей Tab элементу добавляется псевдокласс :focus, и мы можем задать для него красивые стили.

⚠️ Важно! В браузерах Safari и Firefox на Mac при клике мышкой на кнопку фокус не устанавливается.

➡️ После любого селектора ставим двоеточие и пишем ключевое слово focus.

a:focus {
outline: 2px solid hotpink;
}


➡️ Фишки:

Смену стилей между состояниями можно анимировать при помощи transition

В браузер встроены дефолтные стили для фокуса.

Нельзя полностью удалять стили для фокуса, заменяйте их на свои, если дефолтные не нравятся.

Стили для фокуса можно увидеть, открыв сайт и несколько раз нажав клавишу Tab. Или нажмите на кнопку, поставьте курсор в поле ввода.

CodeBase | Frontend | #css

BY CodeBase | Frontend




Share with your friend now:
tg-me.com/codebase_frontend/719

View MORE
Open in Telegram


CodeBase | Frontend Telegram | DID YOU KNOW?

Date: |

If riding a bucking bronco is your idea of fun, you’re going to love what the stock market has in store. Consider this past week’s ride a preview.The week’s action didn’t look like much, if you didn’t know better. The Dow Jones Industrial Average rose 213.12 points or 0.6%, while the S&P 500 advanced 0.5%, and the Nasdaq Composite ended little changed.

Importantly, that investor viewpoint is not new. It cycles in when conditions are right (and vice versa). It also brings the ineffective warnings of an overpriced market with it.Looking toward a good 2022 stock market, there is no apparent reason to expect these issues to change.

CodeBase | Frontend from nl


Telegram CodeBase | Frontend
FROM USA